<template>
    <div style="height: 50px;">
        <el-button @click="updState()">申请退款</el-button>
    </div>

    <!-- 显示列表 -->
    <el-table :data="SalesReturnlist" style="width: 100%" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55" />
        <el-table-column type="index" label="序号" align="center" />
        <el-table-column prop="salesReturnCode" label="销售退货编号" align="center" />
        <el-table-column prop="salesReturnTopic" label="销售退货主题" align="center" />
        <el-table-column prop="clientName" label="客户名称" align="center" />
        <el-table-column prop="salesReturnDate" label="退货日期" align="center">
            <template v-slot="scope">
                {{ scope.row.salesReturnDate.substring(0, 10) }}
            </template>
        </el-table-column>
        <el-table-column prop="salesReturnAmout" label="退货总金额" align="center">
            <template v-slot="scope">
                {{ scope.row.salesReturnAmout.toFixed(2) }}
            </template>
        </el-table-column>
        <el-table-column prop="salesReturnState" label="退款状态" align="center">
            <template v-slot="scope">
                {{ scope.row.salesReturnState == 1 ? "未申请退款" : "已申请退款" }}
            </template>
        </el-table-column>
    </el-table>

    <!-- 分页 -->
    <table style="margin: auto;">
        <tr>
            <td>
                <el-pagination v-model:current-page="show.Pindex" v-model:page-size="show.Psize"
                    :page-sizes="[15, 20, 30, 40]" :background="true" layout="total,slot,sizes" :total="show.lcount">
                    <span> , 每页 {{ show.Psize }} 条，当前 {{ show.Pindex }} / {{ show.pcount }} 条</span>
                </el-pagination>
            </td>
            <td>
                <el-pagination v-model:current-page="show.Pindex" v-model:page-size="show.Psize"
                    :page-sizes="[15, 20, 30, 40]" :background="true" prev-text="上一页" next-text="下一页"
                    layout="slot, prev, pager, next" :total="show.lcount">
                    <el-button :disabled="show.Pindex == 1" @click="show.Pindex = 1">首页</el-button>
                </el-pagination>
            </td>
            <td>
                <el-pagination v-model:current-page="show.Pindex" v-model:page-size="show.Psize"
                    :page-sizes="[15, 20, 30, 40]" :background="true" prev-text="上一页" next-text="下一页"
                    layout="slot, jumper" :total="show.lcount">
                    <el-button :disabled="show.Pindex == show.pcount" @click="show.Pindex = show.pcount">尾页</el-button>
                </el-pagination>
            </td>
        </tr>
    </table>
</template>

<script setup lang='ts'>
import axios from 'axios'
import * as XLSX from 'xlsx';
import { ref, reactive, onMounted, computed } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus';
import { useRouter } from 'vue-router';
const router = useRouter();
import http from '../../../http.js'


const show = reactive({
    Pindex: 1,
    Psize: 10,
    lcount: 0,
    pcount: 0
})

//显示
const SalesReturnlist = ref([])
const GetSalesReturnList = () => {
    axios.get(http.zblnb + '/cw/api/SalesReturn/GetSalesReturn', {
        params: {
            Pindex: show.Pindex,
            Psize: show.Psize,
        }
    })
        .then(res => {
            console.log(res.data.data)
            SalesReturnlist.value = res.data.data.list;
            show.lcount = res.data.data.lcount;
            show.pcount = res.data.data.pcount;
        })
}

//多选框
const check = ref([])
const handleSelectionChange = (val: User[]) => {
    check.value = val
    console.log(check.value)
}

//点击退款
const updState = () => {
    axios.post(http.zblnb + '/cw/api/SalesReturn/UpdStateSalesReturn?SalesReturnId=' + check.value[0].salesReturnId)
        .then(res => {
            if (res.data.data > 0) {
                ElMessage.success('申请成功');
                GetSalesReturnList();
            }
            else {
                ElMessage.error('申请失败');
            }
        })
}


onMounted(() => {
    GetSalesReturnList();
})



</script>

<style></style>